<!--
 * @Author: your name
 * @Date: 2021-08-12 16:13:30
 * @LastEditTime: 2021-08-22 23:21:43
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /day04-网易严选/html/index.html
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>网易严选</title>
  <link rel="stylesheet" href="../css/wyyx.css">
  <!-- 引入字体图标 -->
  <link rel="stylesheet" href="../css/font/demo_index.html">
  <link rel="stylesheet" href="../css/font/iconfont.css">
</head>

<body>
  <!-- header -->
  <div class="header">
    <!-- top -->
    <div class="top">
      <!-- 固定显示内容 -->
      <div class="wapper">
        <div class="left">
          <i class="iconfont icon-tongzhi"></i>
          <a href="">因事件（疫情、特大暴雨、台风）影响，部分地区无法配送公告</a>
        </div>
        <div class="right">
          <div>
            <div>
              <a href="">登录/注册</a>
            </div>
          </div>
          <div>
            <div>
              <a href="">我的订单</a>
            </div>
          </div>
          <div>
            <div>
              <a href="">会员</a>
            </div>
          </div>
          <div>
            <div>
              <a href="">甄选家</a>
            </div>
          </div>
          <div>
            <div>
              <a href="">企业采购
                <i class="iconfont icon-arrowRight-copy "></i>
              </a>
            </div>

          </div>
          <div>
            <div>
              <a href="">客户服务<i class="iconfont icon-arrowRight-copy"></i>
              </a>
            </div>
          </div>
          <div>
            <div>
              <a href="">
                <i class="iconfont icon-shouji"></i>
                APP
              </a>
            </div>

          </div>
        </div>
      </div>
      <!-- 固定显示内容结束 -->
    </div>
    <!-- top结束 -->
    <!-- bottom -->
    <div class="bottom">
      <div class="wapper">
        <!-- search -->
        <div class="search">
          <div class="logo">
            <img src="../img/logopng.png" alt="">
          </div>
          <div class="sousuo">
            <div>
              <div class="search_top">
                <i class="iconfont icon-search"></i>
                <input type="text"><span class="but_text">搜索</span>
              </div>
              <div class="search_bottom">
                <a href="">七夕礼物</a>
              </div>
            </div>
          </div>
          <div class="shopcar">
            <div class="car">
              <i class="iconfont icon-gouwuche1"></i>
              <span>购物车</span>
              <i class="iconfont icon-0"></i>
            </div>
          </div>
        </div>
        <!-- search结束 -->
        <!-- menu -->
        <div class="menu">
          <div class="list">
            <ul>
              <li>
                <a href="">首页</a>
              </li>
              <li>
                <a href="">居家生活</a>
                <div class="second">
  
                  <div class="pro"><a href="">装修</a></div>
                  <div class="pro"><a href="">装修</a></div>
                  <div class="pro"><a href="">装修</a></div>
                  <div class="pro"><a href="">装修</a></div>
                </div>
              </li>
              <li>
                <a href="">服饰鞋包</a>
                <div class="second"><div class="pro"><a href="">装修</a></div></div>

              </li>
              <li>
                <a href="">美食酒水</a>
                <div class="second">美食酒水二级菜单列表</div>
              </li>
              <li>
                <a href="">个护清洁</a>
                <div class="second">个护清洁二级菜单列表</div>
              </li>
              <li>
                <a href="">母婴亲子</a>
                <div class="second">母婴亲子二级菜单列表</div>
              </li>
              <li>
                <a href="">运动旅行</a>
                <div class="second">运动旅行二级菜单列表</div>
              </li>
              <li>
                <a href="">数码家电</a>
                <div class="second">数码家电二级菜单列表</div>
              </li>
              <li>
                <a href="">严选全球</a>
                <div class="second">严选全球二级菜单列表</div>
              </li>
              <li>
                <a href="">为你严选</a>
                <div class="second">为你严选二级菜单列表</div>
              </li>
              <li>
                <a href="">众筹</a>
                <div class="second">众筹二级菜单列表</div>
              </li>
            </ul>
          </div>
        </div>
        <!-- menu结束 -->
      </div>
    </div>
    <!-- bottom结束 -->

  </div>
  <!-- header结束 -->
  <!-- content -->
  <div class="content">
    <!-- 轮播 -->
    <div class="lunbo">
      <img src="../img/lunbo.webp" alt="">
    </div>
    <!-- 轮播结束 -->
    <!-- 热销榜 -->
    <div class="hot_outer">
      <ul class="hot_goods">
        <li>- 热销榜 -</li>
        <li><img src="../img/全站热销榜.webp" alt=""><span>全站<br>热销榜</span></li>
        <li><img src="../img/1居家生活.webp" alt=""><span>居家<br>生活榜</span></li>
        <li><img src="../img/1服饰鞋包.webp" alt=""><span>服饰<br>鞋包榜</span></li>
        <li><img src="../img/1美食酒水.webp" alt=""><span>美食<br>酒水榜</span></li>
        <li><img src="../img/1数码家电.webp" alt=""><span>数码<br>家电榜</span></li>
        <li><img src="../img/1个护清洁.webp" alt=""><span>个护<br>清洁榜</span></li>
        <li><img src="../img/1运动旅行.webp" alt=""><span>运动<br>旅行榜</span></li>
        <li><img src="../img/1母婴亲子.webp" alt=""><span>母婴<br>亲子榜</span></li>
        <li><img src="../img/1全球特色.webp" alt=""><span>全球<br>特色榜</span></li>
      </ul>
    </div>
    <!-- 热销榜结束 -->

    <!-- 人气推荐 -->
    <div class="rqtj">
      <div class="wapper">
        <div class="popularity">
          <div class="title">
            <h3 class="name">人气推荐</h3>
            <div class="headerLeft checked">编辑推荐</div>
            <div class="headerLeft">热销总榜</div>
            <div class="headerRight">更多推荐></div>
          </div>
          <div class="product">
            <div id="productItemFirst" class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/bebff6d69027991f02077dc1f249059f.png?type=webp&quality=95&thumbnail=320x320&imageView"
                alt="图片丢失">
              <div class="title">
                <h4 class="name">
                  口袋里的咖啡馆 浓缩胶囊咖啡 焦糖拿铁1袋
                </h4>
                <p class="price">¥21.8</p>
              </div>
            </div>
            <div class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView"
                alt="图片丢失">
              <div class="title">
                <div class="prdtTags"><span>3件8.5折</span></div>

                <h4 class="name">
                  无添加蔗糖，苏打饼干 360克
                </h4>
                <p class="price">¥12.8
                  <span>
                    ¥88
                  </span>

                </p>
              </div>
            </div>
            <div class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView"
                alt="图片丢失">
              <div class="title">
                <div class="prdtTags"><span>3件8.5折</span></div>

                <h4 class="name">
                  无添加蔗糖，苏打饼干 360克
                </h4>
                <p class="price">¥12.8
                  <span>
                    ¥88
                  </span>

                </p>
              </div>
            </div>
            <div class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView"
                alt="图片丢失">
              <div class="title">
                <div class="prdtTags"><span>3件8.5折</span></div>

                <h4 class="name">
                  无添加蔗糖，苏打饼干 360克
                </h4>
                <p class="price">¥12.8
                  <span>
                    ¥88
                  </span>
                </p>
              </div>
            </div>
            <div class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView"
                alt="图片丢失">
              <div class="title">
                <div class="prdtTags"><span>3件8.5折</span></div>

                <h4 class="name">
                  无添加蔗糖，苏打饼干 360克
                </h4>
                <p class="price">¥12.8
                  <span>
                    ¥88
                  </span>

                </p>
              </div>
            </div>
            <div class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView"
                alt="图片丢失">
              <div class="title">
                <div class="prdtTags"><span>3件8.5折</span></div>

                <h4 class="name">
                  无添加蔗糖，苏打饼干 360克
                </h4>
                <p class="price">¥12.8
                  <span>
                    ¥88
                  </span>

                </p>
              </div>
            </div>
            <div class="productItem">
              <img src="https://yanxuan.nosdn.127.net/static-union/1628213373854ca1.png" alt="图片丢失">
              <img
                src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView"
                alt="图片丢失">
              <div class="title">
                <div class="prdtTags"><span>3件8.5折</span></div>

                <h4 class="name">
                  无添加蔗糖，苏打饼干 360克
                </h4>
                <p class="price">¥12.8
                  <span>
                    ¥88
                  </span>

                </p>
              </div>
            </div>
      </div>
    </div>
    <!-- 人气推荐结束 -->
    <!--居家生活-->
<div class="jjsh">
  <div class="wapper">
  <div class="jjSection">
  <div class="title">
  <h3 class="name">居家生活</h3>
  <div class="headRight">查看更多></div>
  <div class="link">
  <div class="headrightitem">收纳家饰</div>
  <div class="headrightsplit">/</div>
  <div class="headrightitem">好物精选</div>
  <div class="headrightsplit">/</div>
  <div class="headrightitem">疫情防控</div>
  <div class="headrightsplit">/</div>
  <div class="headrightitem">北欧原木</div>
  <div class="headrightsplit">/</div>
  <div class="headrightitem">家庭医疗</div>
  <div class="headrightsplit">/</div>
  <div class="headrightitem">餐厨爆款清单</div>
  <div class="headrightsplit">/</div>
  <div class="headrightitem">厨房电器</div>
  </div>
  </div>
  <div class="image"><ahref=""><img src="https://yanxuan-item.nosdn.127.net/0736325df88942d67a31b5bd5bb2a502.png?type=webp&quality=95&thumbnail=180y180&imageView" alt="图片丢失"></a></div>
  <div class="jjProduct">
  <div class="jjProductItem">
  <div class="photo">
  <div class="photoList">
  <img src="https://yanxuan-item.nosdn.127.net/84454f5de65796c78a5ef9f3d6b7d843.png?type=w
  ebp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  <img src="https://yanxuan-item.nosdn.127.net/8dbb1f0f71cba67e4dc6b38cc49dd584.png?type=w
  ebp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  </div>
  </div>
  <div class="title">
  <div class="prdtTags"><span>每日抄底</span></div>
  <h4 class="name">
  AB面乳胶独立弹簧床垫升级款
  </h4>
  <p class="price">¥1599
  <span>
  ¥2199
  </span>
  </p>
  </div>
  </div>
  <div class="jjProductItem">
  <div class="photo">
  <div class="photoList">
  <img src="https://yanxuan-item.nosdn.127.net/d2c0ecf074703395ebd1f7898c74cce9.png?type=w
  ebp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  <img src="https://yanxuan-item.nosdn.127.net/33a19000c0cf1ba941b818e18e35c61f.png?type=w
  ebp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  </div>
  </div>
  <div class="title">
  <di class="prdtTags"><span>特价</span></div>
  <h4 class="name">
  便携大容量运动水杯吸管款单手畅饮
  </h4>
  <p class="price">¥49
  <span>
  ¥59
  </span>
  </p>
  </div>
  </div>
  <div class="jjProductItem">
  <div class="photo">
  <div class="photoList">
  <img src="https://yanxuan-item.nosdn.127.net/b015c292ad4b9c808d4d6edc64408295.png?type=
  webp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  <img src="https://yanxuan-item.nosdn.127.net/97edf8a6082cdef4c66469b2b52e7bfd.jpg?type=we
  bp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  </div>
  </div>
  <div class="title">
  <div class="prdtTags"><span>奥莱特卖</span></div>
  <h4 class="name">
  白鸭毛羽丝绒床褥<br>升级款
  </h4>
  <p class="price">¥388
  <span>
  ¥499
  </span>
  </p>
  </div>
  </div>
  <div class="jjProductItem">
  <div class="photo">
  <div class="photoList">
  <img src="https://yanxuan-item.nosdn.127.net/035983c08aa9629456423c543581bfa0.png?type=
  webp&imageView&quality=95&thumbnail=245x245"alt="图片丢失">
  <img src="https://yanxuan-item.nosdn.127.net/8b4b003b8326e27d558a43606c537ec1.png?type=
  webp&quality=95&thumbnail=265x265&imageView"alt="图片丢失">
  </div>
  </div>
  <div class="title">
  <div class="prdtTags"><span>特价</span></div>
  <h4 class="name">
  爆款明星好物，抽屉式透明储物柜
  </h4>
  <p class="price">139
  <span>
  ¥139
  </span>
  </p>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
  <!-- content结束 -->
  <!-- footer -->
  <div class="footer">

  </div>
  <!-- footer结束 -->
</body>

</html>